<template>
  <div>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>文件变量转运单内容（下载文件数量 = 有效运单数量 * 选择文件数量）</span>
      </div>
        <el-form ref="waybillVariableForm" :model="waybillVariableData" :rules="rules" size="mini"
                 label-width="100px">
          <el-form-item label="文件" prop="fileIds">
            <el-select v-model="waybillVariableData.fileIds" placeholder="请选择文件" multiple clearable filterable
                       :style="{width: '100%'}">
              <el-option v-for="(item, value) in fileIdsOptions" :key="value" :label="item" :value="value"></el-option>
            </el-select>
          </el-form-item>
          <el-row>
            <el-col :span="6">
              <el-form-item label="运单号" prop="waybillNos">
                <el-input v-model="waybillVariableData.waybillNos" type="textarea" placeholder="请输入运单号"
                          :autosize="{minRows: 4, maxRows: 4}"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="参考号" prop="referenceNos">
                <el-input v-model="waybillVariableData.referenceNos" type="textarea" placeholder="请输入运单号"
                          :autosize="{minRows: 4, maxRows: 4}"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="追踪号" prop="trackNos">
                <el-input v-model="waybillVariableData.trackNos" type="textarea" placeholder="请输入运单号"
                          :autosize="{minRows: 4, maxRows: 4}"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="M单号" prop="masterNos">
                <el-input v-model="waybillVariableData.masterNos" type="textarea" placeholder="请输入运单号"
                          :autosize="{minRows: 4, maxRows: 4}"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item size="mini">
            <el-button type="primary" @click="submitForm">提交</el-button>
          </el-form-item>
        </el-form>
    </el-card>
  </div>
</template>
<script>
  import { ajax } from "@/store/yg/common/utils";
  import { m } from "@/store/yg/common/local";
  import * as constant from "@/store/yg/common/constant";
  export default {
    components: {},
    props: [],
    data() {
      return {
        waybillVariableData: {
          fileIds: [],
          waybillNos: null,
          referenceNos: null,
          trackNos: null,
          masterNos: null
        },
        rules: {
          fileIds: [{
            required: true,
            type: 'array',
            message: '请至少选择一个文件',
            trigger: 'change'
          }]
        },
        fileIdsOptions: [{
          "label": "选项一",
          "value": 1
        }, {
          "label": "选项二",
          "value": 2
        }],
      }
    },
    mounted() {
      this.init();
    },
    methods: {
      async init() {
        const data = await ajax("initWaybillVariableQuery", {});
        this.fileIdsOptions = data.data;
      },
      submitForm() {
        this.$refs['waybillVariableForm'].validate(valid => {
          if (!valid) return
          var params = this.waybillVariableData;
          this.doWaybillVariableConvert(params);
        })
      },
      async doWaybillVariableConvert(params) {
        const data = await ajax("waybillVariableConvert", params);
        if (data.errorMesage) {
          this.$message.error(m(data.errorMesage));
        }else{
          var path = (path = constant.FILE_SERVER + data.path);
          location.href = constant.API_SERVER + "/open/downloadFileByHttp?fileName=&path=" + path;
        }
      }

    }
  }

</script>
<style>
</style>
